<template>
    <div>
        <!-- seach区域 -->
        <div class="seach">
            <span>
                {{$t('tsktpy')}}
                <el-select v-model="taskTab.jobType" :placeholder="$t('plsset')" size="mini">
                    <el-option :label="'-' + $t('plsset') + '-'" :value="null"></el-option>
                    <el-option :label="$t('querytyp')" value="QUERY"></el-option>
                    <el-option :label="$t('downloadbill')" value="DOWN_CHECKUP"></el-option>
                </el-select>
            </span>
            <span>
                {{$t('tsknam')}}
                <el-input v-model.trim="taskTab.jobName" :placeholder="$t('plsset')" size="mini"></el-input>
            </span>
            <span>
                {{$t('tskgrp')}}
                <el-select v-model="taskTab.jobGroup" :placeholder="$t('plsset')" size="mini">
                    <el-option :label="'-' + $t('plsset') + '-'" :value="null"></el-option>
                    <el-option label="settle" value="settle"></el-option>
                    <el-option label="query" value="query"></el-option>
                    <el-option label="TEST" value="TEST"></el-option>
                </el-select>
            </span>
            <span>
                {{$t('sta')}}
                <el-select v-model="taskTab.jobStatus" :placeholder="$t('plsset')" size="mini">
                    <el-option :label="'-' + $t('plsset') + '-'" :value="null"></el-option>
                    <el-option :label="$t('invlid')" value="INVALID"></el-option>
                    <el-option :label="$t('vlid')" value="VALID"></el-option>
                </el-select>
            </span>
            <el-button type="primary" @click="seachTask" size="mini" v-preventReClick>{{$t('qury')}}</el-button>
            <el-button type="warning" @click="showAddTask" size="mini" v-preventReClick>{{$t('add')}}</el-button>
        </div>
        <div class="buttonList">
            <el-button @click="showremovetask" type="danger" size="mini" v-preventReClick>{{$t('dlte')}}</el-button>
            <el-button @click="activeSelTask" size="mini" v-preventReClick>{{$t('actvat')}}</el-button>
            <el-button @click="closeSelTask" size="mini" v-preventReClick>{{$t('close')}}</el-button>
            <el-button @click="getSelTaskSta" size="mini" v-preventReClick>{{$t('getthelastrunsta')}}</el-button>
            <el-button @click="onceRun" size="mini" v-preventReClick>{{$t('ontimexe')}}</el-button>
        </div>
        <!-- 内容区域 -->
        <el-card class="cardBox">
            <el-table border style="width: 100%" :data="taskList" row-key="taskId" @select="handleSelectionChange" @select-all="handleSelectionChange" :row-class-name="tableRowClassName">
                <el-table-column type="index" :label="$t('sernum')" width="48">
                </el-table-column>
                <el-table-column type="selection" :label="$t('choose')" :reserve-selection="true" width="47">
                </el-table-column>
                <el-table-column prop="jobType" :label="$t('tsktpy')" width="87">
                </el-table-column>
                <el-table-column prop="jobName" :label="$t('tsknam')" width="245">
                </el-table-column>
                <el-table-column prop="jobClass" :label="$t('taskclsname')" width="366">
                </el-table-column>
                <el-table-column prop="jobProcTime" :label="$t('runtimeexpsin')" width="157">
                </el-table-column>
                <el-table-column prop="jobGroup" :label="$t('tskgrp')" width="97">
                </el-table-column>
                <el-table-column prop="jobParam" :label="$t('taskparmt')" width="95">
                </el-table-column>
                <el-table-column prop="jobStatus" :label="$t('sta')" width="80">
                </el-table-column>
                <el-table-column prop="lastGetRunstatusTime" :label="$t('lateruntime')" width="200">
                </el-table-column>
                <el-table-column prop="runStatus" :label="$t('runnsta')">
                </el-table-column>
                <el-table-column prop="address" :label="$t('opratn')" width="90" fixed="right">
                    <template slot-scope="scope">
                        <el-link type="primary" @click="operHist(scope.row.taskId)">{{$t('record')}}</el-link>
                        <el-link type="primary" @click="showEditTask(scope.row)">{{$t('mdfy')}}</el-link>
                    </template>
                </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="taskTab.pageNum"
                :page-sizes="[10, 15, 20, 30]"
                :page-size="taskTab.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
            </el-pagination>
        </el-card>
        <!-- 添加弹框 -->
        <el-dialog :title="$t('add')" :visible.sync="addDialogVisible" width="30%" @close="addDialogVisibleClosed(addAppForm)" :close-on-click-modal='isOk' :modal-append-to-body="false">
            <el-form :ref="addAppForm" :rules="addAppVRul" :model="addAppForm" label-width="80px" :hide-required-asterisk="true">
                <el-form-item :label="$t('tsknam')" prop="jobName" :placeholder="$t('plsipt')">
                    <el-input v-model.trim="addAppForm.jobName"></el-input>
                </el-form-item>
                <el-form-item :label="$t('taskclsname')" prop="jobClass" :placeholder="$t('plsipt')">
                    <el-input v-model.trim="addAppForm.jobClass"></el-input>
                </el-form-item>
                <el-form-item :label="$t('tskgrp')" prop="jobGroup" :placeholder="$t('plsipt')">
                    <el-input v-model.trim="addAppForm.jobGroup"></el-input>
                </el-form-item>
                <el-form-item :label="$t('taskparmt')" prop="jobParam" :placeholder="$t('plsipt')">
                    <el-input v-model="addAppForm.jobParam"></el-input>
                </el-form-item>
                <el-form-item :label="$t('executime')" prop="jobProcTime" :placeholder="$t('plsipt')">
                    <el-input v-model="addAppForm.jobProcTime"></el-input>
                </el-form-item>
                <el-form-item :label="$t('tsktpy')" prop="jobType">
                    <el-select v-model="addAppForm.jobType" :placeholder="$t('plsset')" class="sellong">
                        <el-option :label="$t('querytyp')" value="QUERY"></el-option>
                        <el-option :label="$t('downloadbill')" value="DOWN_CHECKUP"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item :label="$t('sta')" prop="status">
                    <el-select v-model="addAppForm.status" :placeholder="$t('plsset')" class="sellong">
                        <el-option :label="$t('vlid')" value="VALID"></el-option>
                        <el-option :label="$t('invlid')" value="INVALID"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="addAppVer(addAppForm)" v-preventReClick>{{$t('cfm')}}</el-button>
                <el-button @click="addDialogVisible = false" v-preventReClick>{{$t('cnl')}}</el-button>
            </span>
        </el-dialog>
        <!-- 修改弹框 -->
        <el-dialog :title="$t('mdfy')" :visible.sync="editDialogVisible" width="30%" @close="editDialogVisibleClosed(editAppForm)" :close-on-click-modal='isOk' :modal-append-to-body="false">
            <el-form :ref="editAppForm" :rules="editAppVRul" :model="editAppForm" label-width="80px" :hide-required-asterisk="true">
                <el-form-item :label="$t('tsknam')" prop="jobName" :placeholder="$t('plsipt')">
                    <el-input v-model.trim="editAppForm.jobName"></el-input>
                </el-form-item>
                <el-form-item :label="$t('taskclsname')" prop="jobClass" :placeholder="$t('plsipt')">
                    <el-input v-model.trim="editAppForm.jobClass"></el-input>
                </el-form-item>
                <el-form-item :label="$t('tskgrp')" prop="jobGroup" :placeholder="$t('plsipt')">
                    <el-input v-model.trim="editAppForm.jobGroup"></el-input>
                </el-form-item>
                <el-form-item :label="$t('taskparmt')" prop="jobParam" :placeholder="$t('plsipt')">
                    <el-input v-model="editAppForm.jobParam"></el-input>
                </el-form-item>
                <el-form-item :label="$t('executime')" prop="jobProcTime" :placeholder="$t('plsipt')">
                    <el-input v-model="editAppForm.jobProcTime"></el-input>
                </el-form-item>
                <el-form-item :label="$t('tsktpy')" prop="jobType">
                    <el-select v-model="editAppForm.jobType" :placeholder="$t('plsset')" class="sellong">
                        <el-option :label="$t('querytyp')" value="QUERY"></el-option>
                        <el-option :label="$t('downloadbill')" value="DOWN_CHECKUP"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item :label="$t('sta')" prop="jobStatus">
                    <el-select v-model="editAppForm.jobStatus" :placeholder="$t('plsset')" class="sellong">
                        <el-option :label="$t('vlid')" value="VALID"></el-option>
                        <el-option :label="$t('invlid')" value="INVALID"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="editAppVer(editAppForm)" v-preventReClick>{{$t('cfm')}}</el-button>
                <el-button @click="editDialogVisible = false" v-preventReClick>{{$t('cnl')}}</el-button>
            </span>
        </el-dialog>
        <el-dialog :title="$t('deltcurrschedtask')" :visible.sync="bridialogVisible" width="30%" :modal-append-to-body="false">
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="removeSelTask(editAppForm)" v-preventReClick>{{$t('cfm')}}</el-button>
                <el-button @click="bridialogVisible = false" v-preventReClick>{{$t('cnl')}}</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import {
    tasklist,
    tasklistup,
    tasklistadd,
    tasklistadel,
    tasklistenab,
    tasklistdisable,
    taskliststatus,
    tasklistdonow
} from '@/libs/reqlist.js'
export default {
    data () {
        return {
            // 判断是否涉及跨页选中标识
            isSave: false,
            isOk: false,
            bridialogVisible: false,
            total: 0,
            addDialogVisible: false,
            editDialogVisible: false,
            selTask: [],
            selTaskId: [],
            taskTab: {
                jobType: '',
                jobStatus: '',
                jobName: '',
                jobGroup: '',
                pageSize: 10,
                pageNum: 1,
                orderParamIdx: '',
                orderType: ''
            },
            taskList: [],
            addAppForm: {
                jobName: '',
                jobClass: '',
                jobGroup: '',
                jobParam: '',
                jobProcTime: '',
                jobType: '',
                status: ''
            },
            editAppForm: {
                taskId: null,
                jobClass: null,
                jobName: null,
                jobProcTime: null,
                jobGroup: null,
                jobType: null,
                jobParam: null,
                jobStatus: null
            },
            editTaskForm: {},
            addAppVRul: {
                jobName: [
                    { required: true, message: this.$t('tasknamecntbemt'), trigger: 'blur' }
                ],
                jobClass: [
                    { required: true, message: this.$t('taskvalcntbemt'), trigger: 'blur' }
                ],
                jobGroup: [
                    { required: true, message: this.$t('taskgroupcntbemt'), trigger: 'blur' }
                ],
                jobParam: [
                    { required: true, message: this.$t('taskparmcntbemt'), trigger: 'blur' }
                ],
                jobProcTime: [
                    { required: true, message: this.$t('taskextimecntbemt'), trigger: 'blur' }
                ],
                jobType: [
                    { required: true, message: this.$t('atsktypcntbemt'), trigger: 'blur' }
                ],
                jobStatus: [
                    { required: true, message: this.$t('taskstacntbemt'), trigger: 'blur' }
                ]
            },
            editAppVRul: {
                jobName: [
                    { required: true, message: this.$t('tasknamecntbemt'), trigger: 'blur' }
                ],
                jobClass: [
                    { required: true, message: this.$t('taskvalcntbemt'), trigger: 'blur' }
                ],
                jobGroup: [
                    { required: true, message: this.$t('taskgroupcntbemt'), trigger: 'blur' }
                ],
                jobParam: [
                    { required: true, message: this.$t('taskparmcntbemt'), trigger: 'blur' }
                ],
                jobProcTime: [
                    { required: true, message: this.$t('taskextimecntbemt'), trigger: 'blur' }
                ],
                jobType: [
                    { required: true, message: this.$t('atsktypcntbemt'), trigger: 'blur' }
                ],
                jobStatus: [
                    { required: true, message: this.$t('taskstacntbemt'), trigger: 'blur' }
                ]
            }
        }
    },
    methods: {
        async getTaskList () {
            await tasklist(JSON.stringify(this.taskTab)).then(res => {
                this.taskList = res.data.list
                this.total = res.data.total - 0
                this.taskList.forEach(item => {
                    if (item.jobType === 'DOWN_CHECKUP') item.jobType = this.$t('stamentdowmload')
                    if (item.jobType === 'QUERY') item.jobType = this.$t('querytyp')
                    if (item.jobStatus === 'INVALID') item.jobStatus = this.$t('invlid')
                    if (item.jobStatus === 'VALID') item.jobStatus = this.$t('vlid')
                    if (item.runStatus === 'NORMAL') item.runStatus = this.$t('normal')
                    if (item.runStatus === 'NONE') item.runStatus = this.$t('notrun')
                    if (item.runStatus === 'BLOCKED') item.runStatus = this.$t('blocked')
                })
            })
        },
        tableRowClassName ({ row, rowIndex }) {
            if (row.runStatus === this.$t('notrun')) {
                return 'warning-row'
            }
            if (row.runStatus === this.$t('blocked')) {
                return 'danger-row'
            }
            return ''
        },
        handleSizeChange (newSize) {
            this.taskTab.pageSize = newSize
            this.getTaskList()
        },
        // 监听总页数变化
        handleCurrentChange (newNum) {
            this.taskTab.pageNum = newNum
            this.getTaskList()
        },
        seachTask () {
            this.taskTab.pageNum = 1
            this.getTaskList()
        },
        showAddTask () {
            this.addDialogVisible = true
        },
        showEditTask (det) {
            this.editDialogVisible = true
            this.editAppForm.taskId = det.taskId
            this.editAppForm.jobClass = det.jobClass
            this.editAppForm.jobName = det.jobName
            this.editAppForm.jobProcTime = det.jobProcTime.trim()
            this.editAppForm.jobGroup = det.jobGroup
            this.editAppForm.jobType = det.jobType
            this.editAppForm.jobParam = det.jobParam
            this.editAppForm.jobStatus = det.jobStatus
            if (this.editAppForm.jobType === this.$t('stamentdowmload')) this.editAppForm.jobType = 'DOWN_CHECKUP'
            if (this.editAppForm.jobType === this.$t('querytyp')) this.editAppForm.jobType = 'QUERY'
        },
        editDialogVisibleClosed (form) {
            this.$refs[form].resetFields()
            Object.assign(this.form, this.$options.data().form)
        },
        editAppVer (form) {
            this.$refs[form].validate(async valid => {
                if (!valid) return
                if (this.editAppForm.jobStatus === this.$t('invlid')) this.editAppForm.jobStatus = 'INVALID'
                if (this.editAppForm.jobStatus === this.$t('vlid')) this.editAppForm.jobStatus = 'VALID'
                this.editAppForm.jobParam = this.editAppForm.jobParam.trim()
                this.editAppForm.jobProcTime = this.editAppForm.jobProcTime.trim()
                tasklistup(JSON.stringify(this.editAppForm)).then(res => {
                    if (res.data.code === '000000') {
                        this.$message({
                            message: this.$t('modfunsuc'),
                            type: 'success'
                        })
                        this.getTaskList()
                        this.editDialogVisible = false
                    }
                })
            })
        },
        addDialogVisibleClosed (form) {
            this.$refs[form].resetFields()
        },
        async addAppVer (form) {
            this.$refs[form].validate(async valid => {
                if (!valid) return
                if (this.addAppForm.jobType === this.$t('stamentdowmload')) this.addAppForm.jobType = 'DOWN_CHECKUP'
                if (this.addAppForm.jobType === this.$t('qury')) this.addAppForm.jobType = 'QUERY'
                if (this.addAppForm.status === this.$t('invlid')) this.addAppForm.status = 'INVALID'
                if (this.addAppForm.status === this.$t('vlid')) this.addAppForm.status = 'VALID'
                this.addAppForm.jobParam = this.addAppForm.jobParam.trim()
                this.addAppForm.jobProcTime = this.addAppForm.jobProcTime.trim()
                await tasklistadd(JSON.stringify(this.addAppForm)).then(res => {
                    this.$message({
                        message: this.$t('funaddsuc'),
                        type: 'success'
                    })
                    this.addDialogVisible = false
                })
            })
        },
        handleSelectionChange (select) {
            this.selTask = select
        },
        showremovetask () {
            this.bridialogVisible = true
        },
        removeSelTask (form) {
            this.selTask.forEach(item => {
                this.selTaskId.push(item.taskId)
            })
            if (this.selTaskId.length === 0) {
                this.$message.error(this.$t('plsctatask'))
                this.bridialogVisible = false
                return false
            }
            tasklistadel(JSON.stringify({ taskIdList: this.selTaskId })).then(res => {
                if (res.data.code === '000000') {
                    this.selTaskId = []
                    this.$message({
                        message: this.$t('dltfunsuc'),
                        type: 'success'
                    })
                    this.bridialogVisible = false
                    this.getTaskList()
                }
            })
        },
        activeSelTask () {
            this.selTask.forEach(item => {
                this.selTaskId.push(item.taskId)
            })
            if (this.selTaskId.length === 0) {
                this.$message.error(this.$t('plsctatask'))
                this.bridialogVisible = false
                return false
            }
            tasklistenab(JSON.stringify({ taskIdList: this.selTaskId })).then(res => {
                if (res.data.code === '000000') {
                    this.selTaskId = []
                    this.$message({
                        message: this.$t('sucactivation'),
                        type: 'success'
                    })
                    this.getTaskList()
                }
            })
        },
        closeSelTask () {
            this.selTask.forEach(item => {
                this.selTaskId.push(item.taskId)
            })
            if (this.selTaskId.length === 0) {
                this.$message.error(this.$t('plsctatask'))
                this.bridialogVisible = false
                return false
            }
            tasklistdisable(JSON.stringify({ taskIdList: this.selTaskId })).then(res => {
                if (res.data.code === '000000') {
                    this.selTaskId = []
                    this.$message({
                        message: this.$t('shutdownsuc'),
                        type: 'success'
                    })
                    this.getTaskList()
                }
            })
        },
        getSelTaskSta () {
            this.selTask.forEach(item => {
                this.selTaskId.push(item.taskId)
            })
            if (this.selTaskId.length === 0) {
                this.$message.error(this.$t('plsctatask'))
                this.bridialogVisible = false
                return false
            }
            taskliststatus(JSON.stringify({ taskIdList: this.selTaskId })).then(res => {
                if (res.data.code === '000000') {
                    this.selTaskId = []
                    this.$message({
                        message: this.$t('getsuc'),
                        type: 'success'
                    })
                    this.getTaskList()
                }
            })
        },
        onceRun () {
            this.selTask.forEach(item => {
                this.selTaskId.push(item.taskId)
            })
            if (this.selTaskId.length === 0) {
                this.$message.error(this.$t('plsctatask'))
                this.bridialogVisible = false
                return false
            }
            tasklistdonow(JSON.stringify({ taskIdList: this.selTaskId })).then(res => {
                if (res.data.code === '000000') {
                    this.selTaskId = []
                    this.$message({
                        message: this.$t('sucfulimp'),
                        type: 'success'
                    })
                    this.getTaskList()
                }
            })
        },
        operHist (id) {
            window.sessionStorage.setItem('taskOperId', id)
            this.$router.push('/sec/runHis')
        }
    },
    mounted () {
        this.getTaskList()
    }
}
</script>

<style lang="less" scoped>
@import './timeTask.less';
</style>
